<template>
	<view class="flex item">
		<view>
			<image class="img" src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" />
		</view>
		<view class="u-p-l-20">
			<view class="title">
				{{ item.name }}
			</view>
			<view class="flex foot">
				<view class="l">
					￥{{ item.price }}
				</view>
				<view class="r">
					已售 {{ item.sall }}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: "myItem",
	data() {
		return {
			item: {
				name: '日常清洁 2小时1人急速清洁全程质保',
				price: 300,
				sall: 40
			}
		};
	},
	methods:{
		backData(){
			console.log('返回到父组件')
		}
	}
}
</script>

<style lang="scss" scoped>
.flex {
	display: flex;
}

.item {
	width: 100%;
	background-color: white;
	height: 210rpx;
	border-radius: 30rpx;
	padding: 20rpx;
	margin-top: 30rpx;
}

.img {
	width: 220rpx;
	height: 100%;
	border-radius: 30rpx;
}
.title{
	font-size: 35rpx;
}
.foot {
	line-height: 40rpx;
	margin-top: 40rpx;
	.l {
		font-size: 40rpx;
		width: 50%;
		text-align: left;
		color: #fc8881;
	}

	.r {
		width: 50%;
		text-align: right;
		color: gray;
	}
}
</style>